<template>
    <div id="topBar" class="createTopBar">
        <div class="linkBar">
            <a href="javascript:void(0);" class="profileTitle">
                <b>{{titleText}}</b>
            </a>
            <div class="linkList">
                <a-button type="link" v-for="item in categories" class="topBarLink">
                   <a-icon v-if="item.icon" :class="item.icon.cssClass" :type="item.icon.type" />
                    {{item.title}}
                </a-button>
            </div>
        </div>
        <div class="stepBar"></div>
    </div>
</template>

<script>
    export default {
        name: "createTopBar",
        props:{
            titleText: {type:String,default(){return '创建记录'}},
            categories:{type:Array,default(){
                return [
                    {title:'个人信息表',icon:{cssClass:'console-icon',type:'home'},route:{}},
                    {title:'督导批阅记录',route:{}},
                    {title:'服务产出与成效',route:{}},
                ];
            }}
        },
        data(){
            return {

            }
        },
        watch:{
            titleText(val){
                this.titleText = val;
            },
            categories(val){
                this.categories = val;
            }
        },
        methods:{
            handleClick(item){

            }
        }
    }
</script>

<style scoped>

</style>